import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
import router from './router'
import Toast, { type PluginOptions, POSITION } from 'vue-toastification'
import 'vue-toastification/dist/index.css'
import '@fortawesome/fontawesome-free/css/all.css'
import './assets/css/global.scss'
import '@fontsource/fira-code/400.css'
import '@fontsource/fira-code/600.css'

const app = createApp(App)

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'

const toastOptions: PluginOptions = {
    position: POSITION.TOP_RIGHT,
    timeout: 3000,
    closeOnClick: true,
    pauseOnFocusLoss: true,
    pauseOnHover: true,
    draggable: true,
    draggablePercent: 0.6,
    transition: 'Vue-Toastification__bounce',
    maxToasts: 5,
    newestOnTop: true,
    toastDefaults: {
        success: {
            timeout: 2000,
            icon: 'fas fa-check-circle',
        },
        error: {
            timeout: 4000,
            icon: 'fas fa-exclamation-circle',
        }
    }
}
  
app.use(Toast, toastOptions)
app.use(ElementPlus)
app.use(createPinia())
app.use(router)

app.mount('#app')